<template>
  <view class="report-menus">
    <public-header title="报表管理"></public-header>
    <view class="menus">
      <view class="menus-box" v-for="item in useMenusList">
        <view class="menus-box-title">
          {{item.title||''}}
        </view>
        <view class="menus-box-group">
          <!-- <view class="menus-box-group-item" :no="menu.no" :class="{disabled:menu.authority===false}" v-for="menu in item.menus" -->
          <view class="menus-box-group-item" :no="menu.no" :class="{disabled:!menuAuth[menu.no]}"
            v-for="menu in item.menus" @click="toPages(menu.target)">
            <image :src="menu.icon" mode="aspectFit" class="menu-icon"></image>
            <view class="menu-label">
              {{menu.name||''}}
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  import lockscreen from '@/common/mixins/lockscreen.js'
  export default {
    mixins: [lockscreen],
    data() {
      return {
        menusList: [{
            title: '经营报表',
            menus: [{
                name: "营业概览",
                target: "/pages/main/report/overview?serviceName=srvretail_business_overview_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/report/yygl.png',
                no: "bxretail_aio_business_overview"
              },
              {
                name: "营收报表",
                target: "/pages/main/report/overview?serviceName=srvretail_revenue_report_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/report/ysbb.png',
                no: 'bxretail_aio_revenue_report'
              },
              {
                name: "流水明细",
                target: "/pages/main/report/overview?serviceName=srvretail_flow_details_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/report/lsmx.png',
                no: 'bxretail_aio_flowing_water'
              },
              {
                name: "销售明细",
                target: "/pages/main/report/overview?serviceName=srvretail_sale_details_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/report/xsmx.png',
                no: 'bxretail_aio_sale_details'
              },
              {
                name: "退款明细",
                target: "/pages/main/report/overview?serviceName=srvretail_refund_order_info_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/tkms.png',
                no: 'srvretail_aio_refund_order_info'
              },
              {
                name: "交易对账",
                target: "/pages/main/report/overview?serviceName=srvretail_refund_Transaction_reconciliation_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/report/jydz.png',
                no: 'srvretail_aio_transaction_reconciliation'
              },
              {
                name: "商品报表",
                target: "/pages/main/report/overview?serviceName=srvretail_product_reaport_info_select&type=overview&isBack=true&title=经营报表",
                icon: '/static/icons/report/spbb.png',
                no: 'srvretail_aio_product_reaport'

              }
            ]
          },
          {
            title: '库存报表',
            menus: [{
              name: "出入库明细",
              target: "/pages/main/report/overview?serviceName=srvretail_in_out_stock_select&isBack=true&title=库存报表&subtitle=出入库明细",
              icon: '/static/icons/report/crk.png',
              no: 'bxretail_aio_in_out_stock'
            }]
          },
          {
            title: '会员报表',
            menus: [{
                name: "会员概览",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_date_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/report/hygl.png',
                no: 'bxretail_aio_member_overview'
              },
              {
                name: "会员卡报表",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_card_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/hyzf.png',
                no: 'bxretail_aio_member_card'
              },
              {
                name: "储值记录",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_recharge_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/report/czjl.png',
                no: 'bxretail_aio_tored_record'
              },
              {
                name: "充值记录",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_recharge_record_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/report/chongzhi.png',
                no: 'bxretail_aio_recharge'
              },
              {
                name: "余额消费记录",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_recordsconsumption_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/report/xf.png',
                no: 'bxretail_aio_consume'
              },
              {
                name: "操作记录",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_operationrecord_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/report/cz.png',
                no: 'bxretail_aio_operate'
              },

              {
                name: "积分记录",
                target: "/pages/main/report/vip?serviceName=srvretail_member_report_points_select&type=vip&isBack=true&title=会员报表",
                icon: '/static/icons/report/jfjl.png',
                no: 'bxretail_aio_integral_record'
              }
            ]
          },
          {
            title: '管理报表',
            menus: [{
                name: "交接班报表",
                target: "/pages/main/report/manage?serviceName=srvretail_handover_count_select&isBack=true&title=管理报表",
                icon: '/static/icons/report/jjb.png',
                no: 'bxretail_aio_handover_count'
              },
              {
                name: "员工收银明细",
                target: "/pages/main/report/manage?serviceName=srvretail_staff_report_cashierdetails_select&isBack=true&title=管理报表",
                icon: '/static/icons/report/ygsymx.png',
                no: 'srvretail_aio_staff_report'
              },
              {
                name: "营业员业绩",
                target: "/pages/main/report/manage?serviceName=srvretail_salesman_report_achievement_select&isBack=true&title=管理报表",
                icon: '/static/icons/report/yyyyj.png',
                no: 'bxretail_aio_salesman_report'
              }
            ]
          },
          {
            title: '营销报表',
            menus: [{
              name: "优惠券统计",
              target: "/pages/main/report/overview?serviceName=srvretail_refund_coupon_statistics_select&isBack=true&title=营销报表&subtitle=优惠券统计",
              icon: '/static/icons/report/yhq.png',
              no: 'bxretail_aio_coupon_total'
            }]
          }
        ]
      }
    },
    computed: {
      useMenusList() {
        return this.menusList
        // let menus = this.$userMenu || uni.getStorageSync('user_menu') || []
        // if (Array.isArray(menus) && menus.length > 0) {
        //   menus = this.deepClone(menus)
        // }
        // return this.menusList.map(item => {
        //   if (Array.isArray(item.menus)) {
        //     item.menus = item.menus.map(menu => {
        //       menu['authority'] = false
        //       for (let um of menus) {
        //         if (menu.no == um.fk_menu_no) {
        //           menu['authority'] = true
        //         }
        //       }
        //       return menu
        //     })
        //   }
        //   return item
        // })
      }
    },
    methods: {
      toPages(target) {
        if (target) {
          uni.navigateTo({
            url: target
          })
        }
      }
    }
  }
</script>

<style lang="scss" scoped>
  .menus {
    display: flex;
    padding: 2rem;
    height: calc(100vh - var(--window-top) - var(--window-bottom) - 6rem);

    &-box {
      margin-right: 2rem;
      padding: 0;
      border-radius: 1rem;

      &:last-child {
        margin-right: 0;
      }

      flex: 1;
      display: flex;
      flex-direction: column;
      min-height: 80vh;

      &-title {
        font-size: $retail-font-size-lg;
        font-weight: 700;
        // margin-bottom: 3rem;
        text-align: left;
        padding: 2rem;
      }

      &-group {
        background-color: #fff;
        flex: 1;
        border-radius: 1rem;

        &-item {
          width: 50%;
          display: inline-flex;
          flex-direction: column;
          align-items: center;
          padding: 2rem 0rem 0;

          .menu-icon {
            width: 10rem;
            height: 10rem;
          }

          .menu-label {
            padding: 2rem 1rem 0;
            font-size: 2.4rem;
          }
        }
      }
    }
  }
</style>
